<template>
    <div >
<van-search
  v-model="title"
  placeholder="请输入搜索关键词"
  wrap-with-form
 
  @search="onSearch"
  @cancel="onCancel"
  
/>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { showToast } from 'vant';

const title = ref('');
 const onSearch = (val) => showToast(`搜索：${val || '无'}`);
    const onCancel = () => showToast('取消');



</script>

<style lang="scss" scoped>
.van-search{
    float: left;
    width: 280px;
}
</style>